UppDrag = function(data){
	this.init(data);
}
UppDrag.prototype = {
		siblingDom:null,
		exceptArea:null,
		currentDom:null,
		parentId:null,
		parentDom:null,
		selectedColor:'#E0ECFF',
		dragCurDom:null,
		className:null,
		exceptClass:null,
		parentWidth:null,
		parentHeight:null,
		parentLeft:null,
		parentTop:null,
		selectChangeHandler:null,
		init:function(data){
			if(data.id && data.className){
				this.parentId = data.id;
				this.className = data.className;
			} else {
				return;
			}
			if(data.noDrag){
				this.exceptClass = data.noDrag;
			}
			if(data.selectedColor){
				this.selectedColor = data.selectedColor;
			}
			this.parentDom = $('#' + this.parentId);
			this.processDom();
			this.drag();
		},
		drag:function(){
			var dragImpl = this;//定义拖拽对象本身，用于内部函数调用
			$('.' + this.className).live('mousedown',function(e){
				dragImpl.dragCurDom = this;
				if(!dragImpl.isValidEvent(e)){
					return;
				}
			//	$(dragImpl.parentDom).css('width',dragImpl.parentWidth);
			//	$(dragImpl.parentDom).css('height',dragImpl.parentHeight);
				dragImpl.changeAbsolute();
				this.style.zIndex = 9999;
				//锁定事件到此元素
			    if (this.setCapture) {
			    	this.setCapture();
			    } else if(window.captureEvents){
			    	window.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP);
			    }
				//设置此元素的鼠标移动事件
			    document.onmousemove = function(e){
					if (!e){
						e = window.event;
					}
					var endX = e.clientX;
					var endY = e.clientY;
					var scrollLeft = $(document).scrollLeft();
					var scrollTop = $(document).scrollTop();
					var left = dragImpl.parentLeft - scrollLeft;
					var right = dragImpl.parentLeft + dragImpl.parentWidth - scrollLeft;
					var top = dragImpl.parentTop - scrollTop;
					var bottom = dragImpl.parentTop + dragImpl.parentHeight - scrollTop;
					if(endX > left && endX < right && endY > top && endY < bottom){
						dragImpl.dragCurDom.style.left = endX - dragImpl.dragCurDom.offsetWidth/2 + scrollLeft + 'px';
						dragImpl.dragCurDom.style.top = endY - dragImpl.dragCurDom.offsetHeight/2 + scrollTop + 'px';
						dragImpl.changeStyle(endX,endY);
					}
				};
				//设置此元素的鼠标弹起事件
				document.onmouseup = function(e){
					if (!e){
						e = window.event;
					}
					document.onmousemove = null;
					document.onmouseup = null;
					dragImpl.changePosition(e);
					dragImpl.processDom();
					if (dragImpl.dragCurDom.releaseCapture) {
						dragImpl.dragCurDom.releaseCapture();
				    } else if(window.releaseEvents){
				    	window.releaseEvents(Event.MOUSEMOVE | Event.MOUSEUP);
				    }
				};
				if (!e){
					e = window.event;
				}
			});
		},
		changePosition:function(e){
			var endX = e.clientX;
			var endY = e.clientY;
			var domLength = this.siblingDom.length;
			var maxIndex = domLength - 1;
			var targetIndex = 0;
			var curDomIndex = 0;
			for(var i=0; i < domLength; i++){
				var tempDom = this.siblingDom[i];
				if(this.isAtDom(endX,endY,tempDom)){
					targetIndex = i;
				}
				if(tempDom.impl == this.dragCurDom){
					curDomIndex = i;
				}
			}
			if(targetIndex == 0 && endY > this.siblingDom[maxIndex].bottom - $(document).scrollTop() && endX > this.siblingDom[maxIndex].right - $(document).scrollLeft()){
				targetIndex = maxIndex;
			}
			if(targetIndex != curDomIndex){
				var temp = this.siblingDom[curDomIndex];
				//元素前移
				if(targetIndex < curDomIndex){
					for(var k=curDomIndex; k > targetIndex; k--){
						this.siblingDom[k] = this.siblingDom[k-1];
					}
				}
				//元素后移
				if(targetIndex > curDomIndex){
					for(var p=curDomIndex; p < targetIndex; p++){
						this.siblingDom[p] = this.siblingDom[p+1];
					}
				}
				//目标位置替换为当前元素
				this.siblingDom[targetIndex] = temp;
			}
			//刷新元素的新位置
		//	$(this.parentDom).css('width','');
		//	$(this.parentDom).css('height','');
			$(this.parentDom).children('.' + this.className).each(function(i){
				$(this).remove();
			});
			for(var j = 0; j < domLength; j++){
				$(this.parentDom).append(this.siblingDom[j].html);
			}
		},
		processDom:function(){
			var parent = document.getElementById(this.parentId);
			this.parentHeight = parent.offsetWidth;
			this.parentWidth = parent.offsetHeight;
			this.parentLeft = this.getX(parent);
			this.parentTop = this.getY(parent);
			this.siblingDom = new Array();
			var dragImpl = this;
			$(this.parentDom).children('.' + this.className).each(function(i){
				dragImpl.saveDom(this,dragImpl.siblingDom);
			});
			if(this.exceptClass && this.exceptClass != null){
				this.exceptArea = new Array();
			}
			if(this.isArray(this.exceptClass)){
				for(i in this.exceptClass){
					this.addInvalidArea(this.exceptClass[i]);
				}
			} else {
				this.addInvalidArea(this.exceptClass);
			}
		},
		addInvalidArea:function(exceptClass){
			if(this.isNotBlank(exceptClass)){
				var dragImpl = this;
				$('.' + exceptClass).each(function(){
					dragImpl.saveDom(this,dragImpl.exceptArea);
				});
			}
		},
		changeAbsolute:function(){
			var length = this.siblingDom.length;
			for(var i=0;i<length;i++){
				var tempDom = this.siblingDom[i];
				tempDom.impl.style.left = tempDom.left + 'px';
				tempDom.impl.style.top = tempDom.top + 'px';
				tempDom.impl.style.position = 'absolute';
			}
		},
		saveDom:function(e,array){
			var offLeft = e.offsetLeft;
			var offTop = e.offsetTop;
			var left = this.getX(e);
			var top = this.getY(e);
			var right = left + e.offsetWidth;
			var bottom = top + e.offsetHeight;
			array.push({color:e.style.backgroundColor,offLeft:offLeft,offTop:offTop,left:left,top:top,right:right,bottom:bottom,impl:e,html:$("<div></div>").append($(e).clone()).html()});
		},
		isAtDom:function(x,y,dom){
			var scrollLeft = $(document).scrollLeft();
			var scrollTop = $(document).scrollTop();
			if(x > dom.left - scrollLeft && x < dom.right - scrollLeft && y > dom.top - scrollTop && y < dom.bottom - scrollTop){
				return true;
			}
			return false;
		},
		getDom:function(e){
			var domLength = this.siblingDom.length;
			for(var i=0;i<domLength;i++){
				var dom = this.siblingDom[i];
				if(dom.impl == e){
					return dom;
				}
			}
		},
		changeStyle:function(x,y){
			var domLength = this.siblingDom.length;
			for(var i=0;i<domLength;i++){
				var tempDom = this.siblingDom[i];
				tempDom.impl.style.backgroundColor = tempDom.color;
			}
			for(var i=0;i<domLength;i++){
				var tempDom = this.siblingDom[i];
				if(this.isAtDom(x,y,tempDom)){
					tempDom.impl.style.backgroundColor = this.selectedColor;
				}
			}
		},
		getX:function(e){
			var x = 0;
			while (e) {
				x += e.offsetLeft;
				e = e.offsetParent;
			}
			return x;
		},
		getY:function(e){
			var y = 0;
			while (e) {
				y += e.offsetTop;
				e = e.offsetParent;
			}
			return y;
		},
		isNotBlank:function(str){
			if(str && str!= null && str!='null' && /\S+/.test(str)){
				return true;
			}
			return false;
		},
		isValidEvent:function(e){
			if(this.exceptArea && this.exceptArea.length > 0){
				var arrayLength = this.exceptArea.length;
				var x = e.clientX;
				var y = e.clientY;
				for(var i=0;i<arrayLength;i++){
					if(this.isAtDom(x,y,this.exceptArea[i])){
						return false;
					}
				}
			}
			return true;
		},
		isArray:function(obj){
			return Object.prototype.toString.call(obj) === '[object Array]';
		}
}